<template>
  <div id="member_myself">
    <h3>修改个人信息</h3>
    <el-form :model="newAdminObj" ref="ruleForm" label-width="100px" class="demo-ruleForm">

      <el-form-item label="昵称" prop="nickname">
        <el-input v-model="newAdminObj.nickname"></el-input>
      </el-form-item>

<!--      <el-form-item label="真实姓名" prop="realName">-->
<!--        <el-input v-model="newAdminObj.realName"></el-input>-->
<!--      </el-form-item>-->

      <el-form-item label="请输入新密码"  prop="password">
        <el-input show-password v-model="newAdminObj.password"  @blur="determinePassword"/>
      </el-form-item>
      <el-form-item label="请确认新密码"  prop="passwordAgain">
        <el-input v-model="newAdminObj.passwordAgain" show-password @blur="determinePassword"/>
      </el-form-item>

<!--      <el-form-item label="性别"  >-->
<!--        <el-radio v-model="newAdminObj.sex" :label="0">男</el-radio>-->
<!--        <el-radio v-model="newAdminObj.sex" :label="1">女</el-radio>-->
<!--      </el-form-item>-->

<!--      <el-form-item label="年龄" >-->
<!--        <el-input v-model="newAdminObj.age"/>-->
<!--      </el-form-item>-->

<!--      <el-form-item label="手机号码" >-->
<!--        <el-input v-model="newAdminObj.phone"/>-->
<!--      </el-form-item>-->

      <el-form-item label="头像上传" >
        <el-upload
            class="avatar-uploader"
            :action="`${baseurl}/image_upload`"
            :show-file-list="false"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload"
        >
          <img :src="newAdminObj.adminIcon?newAdminObj.adminIcon:'https://oss.yhuayi.com/sixth-qianfeng/back/weidenglu.png'" class="avatar">
<!--          <i style="border: 1px dashed #ffff" class="el-icon-plus avatar-uploader-icon"></i>-->
        </el-upload>

      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="updateAdmin">确定修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import {getUserById,adminUpdate} from '../../../network/admin';
import baseurl from "../../../const/baseurl";

export default {
  name: "memberMyself",
  created() {
    this.newAdminObj.username=localStorage.getItem("token")
    console.log(localStorage.getItem("token"))

    getUserById(this.newAdminObj.username).then((result)=>{
      console.log(result);
      const data=result.data.data;
      this.newAdminObj.nickname=data.nickname;
      this.newAdminObj.password=data.password;
      this.newAdminObj.passwordAgain=data.adminPwd;
      this.newAdminObj.adminIcon=data.userPortrait;
      // this.newAdminObj.age=data.adminAge;
      // this.newAdminObj.sex=data.adminSex;
      // this.newAdminObj.realName=data.realName;
      // this.newAdminObj.phone=data.adminPhone;
    }).catch((reason)=>{
      console.log(reason);
    })
  },
  data() {
    return{
      newAdminObj:{
        username: '',
        password: '',
        passwordAgain: '',
        nickname: '',
        age: '',
        sex: '',
        adminIcon: '',
        realName: '',
        phone: '',
      },
      radio:"",
      imageUrl: '',
      back:"",
      member:{},
      baseurl,
      isUpdate:false,
    }
  },
  methods: {
    //判断密码和确认密码是否相同
    determinePassword(){
      if (this.newAdminObj.password === this.newAdminObj.passwordAgain){
        this.isUpdate=true;
      }else{
        if (this.newAdminObj.passwordAgain){
          this.$notify.error({
            title: '两次密码不一致',
            message: '两次输入的密码不一致,请检查',
            duration: 0,
            // type: 'warning',
          });
        }
      }
    },
    handleAvatarSuccess(res, file) {//上传事件
      this.imageUrl = URL.createObjectURL(file.raw);
      // console.log(file);
      console.log(this.imageUrl);
      console.log(res);
      if (res.code===200){
        this.newAdminObj.adminIcon=res.data;
      }
      // console.log(this.admin.adminIcon);
    },
    beforeAvatarUpload() {//file
    },
    updateAdmin(){//更新管理员
      if (this.isUpdate){
        adminUpdate(this.newAdminObj).then((result)=>{
          console.log(result);
          // console.log(result.data.data.code);
          if (result.data.code===200){
            this.$message.success('更新成功!');
            sessionStorage("sixthUrl",'/admin/page/membermyself');
            this.$router.push("/blankPage");
          }
        }).catch((reason)=>{
          console.log(reason);
        })
      }
      // else{
      //   this.$notify.error({
      //     title: '两次密码不一致',
      //     message: '两次输入的密码不一致,请检查',
      //     duration: 0,
      //   });
      // }

    }
  }
}
</script>

<style scoped>
.avatar{
  width: 150px;
  height: 150px;
  object-fit: fill;
}
</style>
